import { Tabs } from 'antd';
import pageStyles from '@/common/pageLayout.less';
import { useContext, useMemo, useState } from 'react';
import { ConractControllerContext } from '../common';
import { ContractChangeModifyView } from './ContractChangeModifyView';
import { UpdateContractBottom } from './UpdateContractBottom';
import { readReadShowFileService } from '@/services/BaseLayout';
import { getBaseUrl } from '@/services/urlconst';

export const ContractChangeTabsView: React.FC = () => {
  /** 获取上下文 */
  const {
    updteAddOrEdit: { editContractRun, addContractRun, editRecordContractRun, submitRecordContractRun, addAndSubmitContractRun },
    pageType,
    curRes,
    locationState,
  } = useContext(ConractControllerContext);

  /**保存当前选中Tabs 下标 */
  const [tabsInfoPaneInfo, setTabsInfoPaneInfo] = useState<Record<string, any>>({
    tabsPaneKey: '1',
    formObj: {},
  });

  // /** 轻阅读预览 */
  const { readReadShowFileRun } = readReadShowFileService();

  /**轻阅读预览 */
  const onOpenReadOfdWord = (fieldUrl: string) => {
    readReadShowFileRun({ fieldPath: `${getBaseUrl()}${fieldUrl}` });
    // readReadShowFileRun({ fieldPath: `http://222.186.101.211:20103${fieldUrl}` });
  };

  /** tabs标签页 */
  const tabsItem = useMemo(() => {
    let items: any[] = [
      {
        label: '详细信息',
        key: '1',
        children: <ContractChangeModifyView onOpenReadOfdWord={onOpenReadOfdWord} />,
      },
    ];
    return items;
  }, [tabsInfoPaneInfo?.tabsPaneKey, curRes, locationState, pageType]);

  /** tabs 标签页操作 */
  const contactsTabsExtra = () => {
    return (
      <UpdateContractBottom
        nextBtnShow={false}
        isBudgetNotBtn={false}
        setTabsInfoPaneInfo={() => {}}
        addContractRun={addContractRun}
        editContractRun={editContractRun}
        editRecordContractRun={editRecordContractRun}
        submitRecordContractRun={submitRecordContractRun}
        addAndSubmitContractRun={addAndSubmitContractRun}
        requestType={true}
        // changeModifyItem={changeModifyItem}
        loadMapInfo={() => {}}
        position="top"
      />
    );
  };

  return (
    <Tabs
      activeKey={tabsInfoPaneInfo?.tabsPaneKey}
      className={pageStyles['commonTabs']}
      type="card"
      onChange={(activeKey: string) => {
        setTabsInfoPaneInfo({
          ...tabsInfoPaneInfo,
          tabsPaneKey: activeKey,
        });
      }}
      items={tabsItem}
      tabBarExtraContent={contactsTabsExtra()}
    />
  );
};
